<li class="filter advanced" id="rootSmartFilterAdvanced" data-attr="advanced">
    <a href="#" class="advanced-button filter-button"
       data-testid="smartfilter-button">
        <i class="fa fa-sliders" style="margin-right: 5px;"></i>
        Advanced
        <i class="fa fa-caret-down" style="margin-left: 5px;"></i>
    </a>








        <div class="advance" style="display: none">

            <form method="get" action="<? echo $_SERVER['REQUEST_URI'];?>">
            <!-- Type -->
            <div class="row_item">
                <p>Type</p>

                <?foreach ($asset_class_list as $asset_class_name){
                    $checked = '';
                    foreach ($_REQUEST['asset_class'] as $asset_class_value){
                        if($asset_class_name == $asset_class_value){
                            $checked = 'checked';
                        }
                    }
                ?>
                    <div>
                        <label>
                            <input type="checkbox" name="asset_class[<?echo $asset_class_name?>]"<?echo $checked;?> value="<?echo $asset_class_name?>">
                        </label>
                        <span class="name"><?echo $asset_class_name?></span>
                        <span class="amount">8191</span>
                    </div>
                    <?;}?>

            </div>







            <!-- Duration -->
            <div class="row_item">
                <p>Duration</p>
                <div class="radiogroup">
                    <ul>
                        <li>
                            <label>
                                <input type="radio" name="duration" value="0" <? if($_REQUEST['duration'] == 0) echo 'checked'?>>
                                <span>All</span>
                            </label>
                        </li>
                        <li>
                            <label>
                                <input type="radio" name="duration" value="1" <? if($_REQUEST['duration'] == 1) echo 'checked'?>>
                                <span class="name">Short (&lt;5min)</span>
                                <span class="amount">743</span>
                            </label>
                        </li>
                        <li>
                            <label>
                                <input type="radio" name="duration" value="2" <? if($_REQUEST['duration'] == 2) echo 'checked'?>>

                                <span class="name">Medium (5-20min)</span>
                                <span class="amount">22</span>
                            </label>
                        </li>
                        <li>
                            <label>
                                <input type="radio" name="duration"  value="3" <? if($_REQUEST['duration'] == 3) echo 'checked'?>>
                                <span class="name">Long (&gt;20min)</span>
                                <span class="amount">0</span>
                            </label>
                        </li>
                    </ul>
                </div>
            </div>



            <!-- Date added -->
            <div class="row_item">
                <p>Date added</p>
                <select class="dateselect" >
                    <option value="all" name="date_select"  <? if($_REQUEST['date_select'] == 'all') echo 'selected'?>>All</option>
                    <option value="today" name="date_select" <? if($_REQUEST['date_select'] == 'today') echo 'selected'?>>Today</option>
                    <option value="this_week" name="date_select" <? if($_REQUEST['date_select'] == 'this_week') echo 'selected'?>>This week</option>
                </select>
                <br class="clearfloat"/>
                <input id="date_start" value="<?echo $_REQUEST['date_start'];?>" name="date_start" class="search-period " placeholder="DD/MM/YYYY" spellcheck="false" type="text" >
                -
                <input id="date_end" value="<?echo $_REQUEST['date_end'];?>"  name="date_end" class="search-period " placeholder="DD/MM/YYYY" spellcheck="false" type="text">
            </div>

            <!-- DPI -->
            <!--    <div class="row_item">-->
            <!--        <p>DPI</p>-->
            <!--        <div class="InputWrapper-sc-1ha4tm6-0 cqqUcp">-->
            <!--            <input autocomplete="off" autocorrect="off" placeholder="All"-->
            <!--                   spellcheck="false" type="text" value="">-->
            <!--            <button type="button" aria-label="Open calendar">-->
            <!--                <svg viewBox="0 0 24 24"><path d="M19 3h1c1.1 0 2 .9 2 2v16c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2h1V1h2v2h10V1h2v2ZM4 21h16V8H4v13Z"></path></svg>-->
            <!--            </button>-->
            <!--        </div>-->
            <!--    </div>-->




            <div class="advance-submit">
                <input type="submit" value="submit">
            </div>
            </form>
        </div>






</li>




<script>
$(document).ready(function(){
    $('.advanced-button').click(function(e){
        e.preventDefault(); // 阻止默认跳转

        // 找到当前按钮同级的 .advance 元素并切换显示状态
        $(this).siblings('.advance').toggle();
    });
});

</script>